<template>
	<view class="Role-selection">
		<view class="title">
			<text class="users">您的角色是？</text>
			<text class="serve">我们根据选择为您提供更精准的服务</text>
		</view>
		
		
		<view class="content">
			<view class="row" @click="onEnterprise">
				<view class="item">
					我是企业
				</view>
				<view class="tel">
					为企业提供专业型人才
				</view>
			</view>
			<view class="row" @click="onEntrepreneurship">
				<view class="item">
					我是创业店主
				</view>
				<view class="tel">
					开设空中劳务店铺进行创业
				</view>
			</view>
		</view>

		
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	
	//企业跳转首页
	const onEnterprise = () =>{
		uni.navigateTo({
			url:"/pages/Home/Home"
		})
	}
	//创业者跳转首页
	const onEntrepreneurship = () =>{
		uni.navigateTo({
			url:"/pages/Home/Home"
		})
	}
	
</script>

<style lang="scss" scoped>
	.Role-selection {
		padding: 12vh 50rpx;

		.title {
			display: flex;
			justify-content: space-between;
			flex-direction: column;
			.users{
				font-size: 45rpx;
				font-weight: bold;
				padding-bottom: 20rpx;
			}
			.serve{
				font-size: 20rpx;
			}
		}
		
		.content {
			display: flex;
			justify-content: space-between;
			align-items: center;
			flex-direction: column;
			margin-top: 80rpx;
			.row{
				border: 1px solid;
				width: 100%;
				height: 200rpx;
				margin-bottom: 30rpx;
				border-radius: 5rpx;
				display: flex;
				justify-content: center;
				flex-direction: column;
				.item{
					font-size: 35rpx;
					font-weight: bold;
					margin-left: 40rpx;
					padding-bottom: 10rpx;
				}
				.tel{
					font-size: 20rpx;
					color: #888;
					margin-left: 40rpx;
				}
			}
		}



	}
</style>
